import { View } from '@tarojs/components'
import { Cell } from '@antmjs/vantui'

import { getArticleList } from './api'

import ArticleFilter from './filter'
import usePagination from '../../common/hooks/usePagination'
import ProList from '../../components/ProList'

const searchBarHeight = 55
const defaultParams = {
	kind: '动力煤 '
}
const ArticleListPage = () => {
	const {
		list,
		loading,
		setLoading,
		isLastPage,
		refresh,
		error,
		reload,
		fetchNextPage,
		setRequestParams
	} = usePagination({ api: getArticleList, params: defaultParams })

	const onFilterChange = params => {
		setRequestParams(params)
		setLoading(true)
	}

	return (
		<View>
			<ArticleFilter onChange={onFilterChange} />
			<ProList
				height={`calc(100vh - ${searchBarHeight}px)`}
				reflesh={refresh}
				loading={loading}
				data={list}
				error={error}
				isLastPage={isLastPage}
				reload={reload}
				getNextPage={fetchNextPage}
				itemRender={item => {
					return (
						<View key={item.id}>
							<Cell
								title={item.title}
								titleWidth='60%'
								value={item.updatedTime}
								titleStyle={{
									overflow: 'hidden',
									textOverflow: 'ellipsis',
									whiteSpace: 'nowrap'
								}}
							/>
						</View>
					)
				}}
			/>
		</View>
	)
}

export default ArticleListPage
